import Vue from "vue";
import VueRouter from "vue-router";

import Home from "@/pages/Home";
import TodoList from "@/pages/TodoList";
import NotFound from "@/pages/NotFound";
import Girl from "@/pages/Girl";

Vue.use(VueRouter)

const router = new VueRouter({
  mode: 'history',
  linkExactActiveClass: 'exact-active',
  // mode: 'hash',
  routes: [
    {
      path: '/',
      component: Home,
      name: 'Home'
    },
    // http://localhost:8080/todo
    // http://localhost:8080/todolist
    {
      path: '/home',
      redirect: '/'
    },
    {
      path: '/girl/:id',
      component: Girl,
      name: 'Girl'
    },
    // http://localhost:8080/todolist
    {
      path: '/todolist',
      component: TodoList,
      name: 'TodoList'
    },
    {
      path: '/todolist/:id',
      // 异步加载组件, 动态的import
      component: () => import('@/pages/TodolistShow'),
      name: 'TodoListShow'
    },
    {
      path: '/foo',
      component: () => import('@/pages/Foo')
    },
    {
      path: '/bar',
      component: () => import('@/pages/Bar')
    },
    {
      path: '*',
      component: NotFound
    },
  ]
})

export default router

/*
* hash
* http://localhost:8080/#/
* http://localhost:8080/#/todolist
*
* http://localhost:8080/
* http://localhost:8080/todolist
*
* */

